<template>
  <div class="vc-data">数据加载组件</div>
</template>

<script setup>
import {watch, onMounted, ref} from 'vue';
import visual from "@/visual/js/visual";

const props = defineProps({
  node: Object,
  compStyle: Object,
  compData: Object
});
const currNode = ref(props.node);
const queryInfo = ref({
  pageNumber: 1,
  pageSize: 1
});

const loadData = async() => {
  const dataList = (await visual.loadData(
    props.compData,
    {},
    {...queryInfo.value},
    currNode.value)).data || [];
  currNode.value.compData.dataList = JSON.stringify(dataList);
};

watch(() => props.compData?.refresh, () => {
  loadData();
});

onMounted(() => {
  loadData();
});
</script>

<style scoped>
.vc-data {
  width: 100%;
  padding: 10px 0;
  text-align: center;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
</style>